import React from 'react';
import { NavLink } from 'react-router-dom';
import { HeaderNav, Footer } from 'components';
import './index.less'
import renderRoutes from 'libs/routes'
import createContext from 'libs/context'
import http from 'libs/http'

const { Provider } = createContext('authority', '');

export default class Login extends React.Component {
  state = {
    authority: '',
  }

  componentDidMount() {
    this.checkRoleType()
  }

  checkRoleType = () => {
    http.get('/role/getRole').then(res => {
      res.data && this.setState({
        authority: res.data
      })
    })
  }

  render () {
    const { authority } = this.state
    return (
      <div className="login-container">
        <HeaderNav history={this.props.history} />
        <div className="custom-modal">
          <div className="left desc">
            <div className="title">
              <h2>改变世界，从学习开始</h2>
              <h3>CHANGE THE WORLD! LEARN FIRST!</h3>
            </div>
            <div className="item">
              <p>龙英语</p>
              <ul>
                <li>专属外教听说+中教语法</li>
                <li>一对二在线学习，省钱更高效！</li>
              </ul>
            </div>
            <div className="item">
              <p>龙编程</p>
              <ul>
                <li>趣味入门，高阶算法进阶，</li>
                <li>掌握逻辑，成就创造力</li>
              </ul>
            </div>
          </div>
          <div className="right form-container">
            <Provider value={{ authority }}>
              {renderRoutes('/student')}
            </Provider>
            {/* <NavLink to='/home' className="back">返回</NavLink> */}
          </div>
        </div>
        <Footer />
      </div>
    )
  }

}
